<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>

<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
	    <base href="<%=basePath%>">
	    
	    
		<title>嗨扑米-用户登录/注册</title>
		
		<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
		<meta http-equiv="description" content="this is my page">
		<meta http-equiv="content-type" content="text/html; charset=UTF-8">
		<link rel="icon" href="images/haipumi.ico"/> 
		<link href="css/global.css" rel="stylesheet" type="text/css">
		<link rel="stylesheet" type="text/css" href="css/login.css">
		<script src="js/jquery-1.11.3.min.js"></script>
		<script src="js/login.js"></script>
		
		<!--为了引入按钮-->
		
		<link rel="stylesheet" href="css/bootstrap.min.css">
		<link rel="stylesheet" href="dist/ladda-themeless.min.css">
		<link rel="stylesheet" href="css/prism.css">
		
		
		<!-- 主题有关的样式列表 -->
		<link rel="stylesheet" type="text/css" href="jquery-easyui-1.4.3/themes/black/easyui.css">
		<link rel="stylesheet" type="text/css" href="jquery-easyui-1.4.3/themes/icon.css">
		
		<!-- jquery 和   easyui  的主要组件 -->
		<script type="text/javascript" src="jquery-easyui-1.4.3/jquery.min.js"></script>
		<script type="text/javascript" src="jquery-easyui-1.4.3/jquery.easyui.min.js"></script>
		<script type="text/javascript" src="jquery-easyui-1.4.3/locale/easyui-lang-zh_CN.js"></script>  

  </head>
  
  <body>
	    <!--头部内容开始 -->
	    <iframe class="yhj_head" src="head.jsp"></iframe>
	    <!--头部内容结束-->
	    
	    <div class="yhj_quickregister_0"></div><!--只是用来占位的-->
	    
	    
	  
		<!--中间内容开始-->
	    <div class="yhj_login_main">
	    	<div class="yhj_login_main_scroll">
	        	<div class="yhj_login_main_scroll_bigblock">
	            	<c:forEach items="${applicationactivity}" varStatus="i" var="item" >
                        	<c:if test="${!(item.acstatus eq '0')}"> 
								<img class="yhj_login_main_scroll_bigblock_img" src="images/mixedPicData/${item.acphoto }" />
							</c:if>
					</c:forEach>     
					<!-- img class="yhj_login_main_scroll_bigblock_img" src="images/mixedPicData/lk_select_jj_bg1.jpg" />
					<img class="yhj_login_main_scroll_bigblock_img" src="images/mixedPicData/lk_select_rw_bg1.jpg" />
					<img class="yhj_login_main_scroll_bigblock_img" src="images/mixedPicData/lk_select_xqx_bg1.jpg" /> -->
	            </div>
	            <div class="yhj_login_main_scroll_num">
	            	<ul>
	                	<li>1</li>
	                    <li>2</li>
	                    <li>3</li>
	                </ul>
	            </div>
	            <div class="yhj_login_main_scroll_contentblock">
	            	<div class="yhj_login_main_scroll_contentblock_login" >
	                	<img src="images/yhj_20150901105929.png" width="150"/ style="margin-left:90px;">
	               		<form name="yhj_login_main_scroll_contentblock_login_form" id="yhj_login_main_scroll_contentblock_login_form">
	                    	<center>
	                            <p><label for="yhj_login_main_scroll_contentblock_login_uname">用户名:<br/></label><input  type="text" class="yhj_input" id="yhj_login_main_scroll_contentblock_login_uname" placeholder="请输入您的用户名..." size="30"/></p>
	                            <p><label for="yhj_login_main_scroll_contentblock_login_upwd">密&nbsp;&nbsp;&nbsp;码: <br/></label><input  type="password" class="yhj_input" id="yhj_login_main_scroll_contentblock_login_upwd" placeholder="请输入您的密码..." size="30" /></p>
	                            <p><label for="yhj_login_main_scroll_contentblock_login_safecode">验证码:<br/></label><input type="text" class="yhj_input" id="yhj_login_main_scroll_contentblock_login_safecode" placeholder="请输入下方的验证码..." size="30" /></p>
	                            <img src="code.action" class="safecode" onClick="recode()";/>
	                        </center>
	                    </form>
	                     <p><input type="checkbox" id="yhj_login_main_scroll_contentblock_login_remember" style="display:none;"/><label style="display:none; class="yhj_login_main_scroll_contentblock_login_remember" for="yhj_login_main_scroll_contentblock_login_remember">记住我</label></p>
	                   		<a href="#" style="position:absolute;right:70px;top:330px;">忘记密码?</a>
	                        <img id="safecodeimg" src="images/yhj_refresh-blue.png" style="position:absolute;right:120px;top:280px;" onClick="recode()"/>
	                 	<center>
	                    	<button class="btn btn-danger ladda-button" data-style="expand-left" style="position:relative;top:130px;" onClick="readytologin()"><span class="ladda-label">登录</span></button>
	                    </center>
	                    
	                </div>
	                <div class="yhj_login_main_scroll_contentblock_register" style="display:none;">
	               		<form action="" method="post" id="yhj_login_main_scroll_contentblock_register_form">
	                    	<center>
	                            <p><label for="yhj_login_main_scroll_contentblock_register_uname">用户名:<br/></label><input type="text"  id="yhj_login_main_scroll_contentblock_register_uname" placeholder="请输入您喜欢的用户名..." size="30"/></p>
	                           	<span class="yhj_login_main_scroll_contentblock_register_span"><img src="images/yhj_wenhao.png" width="15"/>&nbsp;&nbsp;用户名长度在5个汉字或10个英文字母以内(1，2，中文，_)</span>
	                            <p><label for="yhj_login_main_scroll_contentblock_register_upwd">密&nbsp;&nbsp;&nbsp码: <br/></label><input type="password" id="yhj_login_main_scroll_contentblock_register_upwd" placeholder="请输入您的密码..." size="30" /></p>
	                            <span class="yhj_login_main_scroll_contentblock_register_span"><img src="images/yhj_wenhao.png" width="15"/>&nbsp;&nbsp;密码由数字和字母组成，长度在6~18位</span>
	                            <p><label for="yhj_login_main_scroll_contentblock_register_uemail">邮&nbsp;&nbsp;&nbsp箱: <br/></label><input type="text"/ id="yhj_login_main_scroll_contentblock_register_uemail" placeholder="请输入下方的验证码..." size="30" /></p>
	                            <span class="yhj_login_main_scroll_contentblock_register_span"><img src="images/yhj_wenhao.png" width="15"/>&nbsp;&nbsp;请填写您的邮箱，例如@163.com,@qq.com...</span>                       		
	                            <p><label for="yhj_login_main_scroll_contentblock_register_safecode">验证码:<br/></label><input type="text"/ id="yhj_login_main_scroll_contentblock_register_safecode" placeholder="请输入下方的验证码..." size="30" /></p>
	                            <span class="yhj_login_main_scroll_contentblock_register_span"><img src="images/yhj_wenhao.png" width="15"/>&nbsp;&nbsp;请输入您邮箱中收到的验证邮件的验证码...</span>                  		
	                        </center>
	                   		<!--<a href="#" style="position:absolute;right:30px;top:276px;">忘记密码</a>
	                        <a href="#" style="position:absolute;right:30px; top:200px;">发送验证邮件</a>-->
	                        
	                    </form>
	                 	<center>
	                    	<button class="btn btn-danger ladda-button" data-style="expand-left" style="position:relative;top:20px;"><span class= "ladda-label">注册</span></button>
	                    </center>
	                </div>
	            </div>
	            <div class="yhj_login_main_scroll_contentblock_card">
	            	<ul>
	                	<li>登录</li>
	                    <li>注册</li>
	                </ul>
	            </div>
	        </div>
	    </div>
	    <!--中间内容结束-->
	    
	    
	     <!--foot内容开始 -->
	     <iframe class="yhj_foot" src="foot.html"></iframe>
	     <!--foot内容结束-->
	       
	     <!--  Totop按钮-->
	     <div class="yhj_totop">
	        <img src="images/yhj_right39.png" width="40" height="40"/>
	     </div>
	     <!--按钮结束-->
	     
	     
		<div id="infomessage" style="position:absolute;bottom:0px; right:50px;display:none;">
		    <div id="p" class="easyui-panel" title="提示信息" 
		            style="width:200px;height:150px;padding:10px;background:#fafafa;"
		            data-options="iconCls:'icon-undo',modal:true">
		        <p>显示提示信息</p>
		    </div>
		</div>
		
		<div id="infomessage2" style="position:absolute;bottom:0px;left:300px;display:none;">
			<div id="p" class="easyui-panel" title=" 提示信息"   	
			        style="width:700px;height:150px;padding:10px;background:#fafafa;"  
			        data-options="iconCls:'icon-help'">  
			    <br/>
			    <p style="color:black;font-size:14px;">panel content.</p>   
			</div>  
		</div>
	     
		<script src="dist/spin.min.js"></script>
	    <script src="dist/ladda.min.js"></script>
	    
	    <script>
	    
		    function showinfobox(flag,image,string){
				if(flag==1){
					if(image!=""){
						
					}
					$("#infomessage").stop(true,true);
					$("#infomessage p").html(string);
					$("#infomessage").slideDown('narmal').delay(3000).slideUp('fast');
				}else if(flag==2){
					if(image!=""){
						
					}
					$("#infomessage2").stop(true,true);
					$("#infomessage2 p").html(string);
					$("#infomessage2").slideDown('narmal').delay(3000).slideUp('fast');
				}
			}
	    
	    	function readytologin(){
	    		//新建一个timeout计时器，等登录时按钮的效果已经做完以后，才真正执行login
	    		setTimeout("login()",1000);
	    	}
	    	function login(){
	    		//alert("asd");
	    		//验证表格数据
	    		var uname=$("#yhj_login_main_scroll_contentblock_login_uname").val();
	    		//alert(uname);
	    		var upwd=$("#yhj_login_main_scroll_contentblock_login_upwd").val();
	    		var safecode=$("#yhj_login_main_scroll_contentblock_login_safecode").val();
	    		var remember=$("#yhj_login_main_scroll_contentblock_login_remember");//记住我的选项，还没有做
	    		
	    		if(uname==""){
	    			showinfobox(2,"","请填写用户名...");
	    			return;
	    		}else if(upwd==""){
	    			showinfobox(2,"","请填写用户密码...");
	    			return;
	    		}else if(safecode==""){
	    			showinfobox(2,"","请填写填写页面上出现的验证码，长度为4...");
	    			recode();
	    			return;
	    		}
	    		//向服务器发异步 请求
	    		//alert("Sdf");
	    		$.ajax({
					type:"POST",
					url:"cust.action?op=login",
					data:{
						ulogon:$("#yhj_login_main_scroll_contentblock_login_uname").val(),
						upwd:$("#yhj_login_main_scroll_contentblock_login_upwd").val(),
						safecode:$("#yhj_login_main_scroll_contentblock_login_safecode").val()
					},
					dataType:"JSON",
					 success:function(data){
						//alert("login");
						if(data.code==1){
							//成功
							location.href="index.jsp";
						}else if(data.code==0){
							showinfobox(2,"",data.msg);
							recode();
						}else if(data.code=2){//现在暂时没有用，如果有登陆后需要跳转的可以用code=2，在msg中存跳转地址
							//拼接的fid在不取的时候对页面不造成影响
							location.href=data.msg+"&fid=0";
							//location.href=data.msg+"&fid=2";
						}
					 }
				});
	    	}
	    	
	        // Bind normal buttons
	        Ladda.bind( 'div:not(.progress-demo) button', { timeout: 2000 } );
	    
	        // Bind progress buttons and simulate loading progress
	        Ladda.bind( '.progress-demo button', {
	            callback: function( instance ) {
	                var progress = 0;
	                var interval = setInterval( function() {
	                    progress = Math.min( progress + Math.random() * 0.1, 1 );
	                    instance.setProgress( progress );
	    
	                    if( progress === 1 ) {
	                        instance.stop();
	                        clearInterval( interval );
	                    }
	                }, 200 );
	            }
	        } );
	        
	        $(function(){
	        	recode();
	        })
	    
	        // You can control loading explicitly using the JavaScript API
	        // as outlined below:
	    
	        // var l = Ladda.create( document.querySelector( 'button' ) );
	        // l.start();
	        // l.stop();
	        // l.toggle();
	        // l.isLoading();
	        // l.setProgress( 0-1 );
	        
	        function recode(){
				$(".safecode").attr("src","code.action?t="+Math.random());
				$("#yhj_login_main_scroll_contentblock_login_safecode").val("");
			}
	    
	    </script>
	    
	    
	    <script type="text/javascript" src="js/prism.js"></script>

  </body>
</html>
